<template>
        <div class="sure-order-container">
            <div class="vip-card-order">
                <div class="card-detail">
                    <img :src="imgUrl" alt="">
                    <div class="detail-intro">
                        <p>{{circleName}}</p>
                        <p>{{username}}<span>数量：{{num}}</span></p>
                    </div>
                </div>
                <div class="circle-mall">
                    <p>席位单价<span>¥{{circleprice}}／席</span></p>
                    <p v-if="isAgent">优惠<span>-{{orderInfo.scale}}%</span></p>
                </div>
                <div class="all-price">
                    合计：<span>¥{{totalprice}}</span>
                </div>
            </div>
            <div class="pay-style-box">
                <div class="title">支付方式</div>
            </div>
            <pay-style v-if="isAgent" type=0 :iswechat="false" :pay="payStyles" @changePay="changePay" :balance="orderInfo.balance"></pay-style>
            <pay-style v-if="!isAgent" :iswechat="false" type=2 :pay="payStyles" @changePay="changePay" :balance="money"></pay-style>    
            <pay-style v-if="!isAgent" :iswechat="true" type=1 :pay="payStyles" @changePay="changePay" :balance="money"></pay-style>        
            <!-- <pay-style v-if="!isAgent" :iswechat="true" type=1 :pay="payStyles" @changePay="changePay"></pay-style> -->
            <div class="footer-pay-box" @click="payCard">立即支付</div>
            <address-box v-if="showAddress" @cancelAddress="cancelAddress"></address-box>
            <com-dialog v-if="showDialog" :dialogConent="dialogConent" @leftBtn="cancelBtn" @rightBtn="sureBtn"></com-dialog>
        </div>
    </template>
    <script>
        import Big from 'big.js';
        import {Toast} from 'mint-ui'
        import comDialog from '@/components/comDialog.vue'
        import addressBox from '../addressBox.vue'
        import payStyle from '../payStyle.vue'
        import cookie from '../../../../util/cookie.js'
        import market from '@/api/market.js'
        import pay from '@/api/thirdPay.js'

        export default {
            components: {
                comDialog,
                addressBox,
                payStyle
            },
            data () {
                return {
                    singlePrice: 0,
                    showDialog: false,
                    dialogConent: {
                        title: '您还未设置收货地址<br/>快去设置吧～',
                        left: '取消',
                        right: '设置'
                    },
                    showAddress: false,
                    payStyles: [
                        {
                            isRem: true,
                            isEnough: true
                        },
                        {
                            isRem: false,
                            isEnough: true
                        },
                        {
                            isRem: true,
                            isEnough: true
                        }
                    ],
                    curindex: 0,
                    isRem: true,
                    circleprice: cookie.get('circleprice'),
                    username: localStorage.username,
                    circleName: localStorage.circleName,
                    circleCode: cookie.get('circleCode'),
                    orderInfo: '',
                    num: cookie.get('num'),
                    allprice: cookie.get('allprice'),
                    isAgent: '',
                    agentId: '',
                    level: '',
                    uid: '',
                    noMoneny: false,
                    isChecked: false,
                    money: 0,
                    modelCancelStatus: '',
                    imgUrl: cookie.get('img')
                }
            },
            created () {
                this.isAgent = localStorage.getItem('dongHang_data') ? true : false
                this.agentId = this.$route.query.agentId
                this.level = this.isAgent ? JSON.parse(localStorage.getItem('dongHang_data')).level : -1
                this.uid = JSON.parse(localStorage.getItem('dongHang_common_user')) ? JSON.parse(localStorage.getItem('dongHang_common_user')).uid : ''
				this.circleprice = cookie.get('circleprice')
            },
            computed: {
                totalprice () {
                    if (this.allprice && this.orderInfo.scale && this.isAgent) {
                        let result = new Big(this.circleprice).times(1-this.orderInfo.scale*0.01);
                        let reg = /\./;
                        result = result.toString();
                        if (!reg.test(result)) {
                            result = result + '.00';
                        }
                        return Number(result * this.num).toFixed(2);
                    } else {
                        return Number(this.allprice * this.num).toFixed(2)
                    }
                },
            },
            mounted () {
                if (this.isAgent) {
                    this.curindex = 0
                    market.confirmInfo({
                        agentId: this.$route.query.agentId,
                        type: 1,
                        status: this.$route.query.status
                    }).then (res => {
                        if (res.code == 0) {
                            this.orderInfo = res.t
                            this.singlePrice = Number(cookie.get('circleprice') * (1 - (this.orderInfo.scale * 0.01))).toFixed(2);
                        }
                    })
                } else {
                    this.curindex = 2
                    market.getUserAccount({uid: this.uid}).then(res => {
                        this.money = res.t
                    })
                }
            },
            methods: {
                payCard () {
                    this.isChecked = this.payStyles[0].isRem || this.payStyles[1].isRem || this.payStyles[2].isRem
                    if (!this.isChecked) {
                        Toast({
                            message: '请选择支付方式',
                            position: 'middle',
                            duration: 1000
                        });
                    } else {
                        if (this.isAgent) {
                            var obj = {
                                cid: this.$route.query.pid,
                                buyNum: parseInt(cookie.get('num')),
                                price: Math.ceil(this.singlePrice * 100),
                                status: this.$route.query.status,
                                agentId: this.$route.query.agentId
                            }
                            market.buyCircle(obj).then (res => {
                                if (res.code == 0) {
                                    this.dialogConent = {
                                        title: '购买成功！<br/>请前往“我的席位”中查看',
                                        left: '取消',
                                        right: '立刻前往'
                                    }
                                    this.modelCancelStatus = 'success'
                                    this.noMoneny = false
                                    this.showDialog = true
                                    market.confirmInfo({
                                        agentId: this.$route.query.agentId,
                                        type: 1,
                                        status: this.$route.query.status
                                    }).then (res => {
                                        if (res.code == 0) {
                                            this.orderInfo = res.t
                                        }
                                    })                               
                                } else if (res.code == -2) {
                                    this.dialogConent = {
                                        title: '账户余额不足！<br/>请联系懂行客服充值',
                                        left: '取消',
                                        right: '确认'
                                    }
                                    this.showDialog = true
                                    this.noMoneny = true
                                    this.payStyles[this.curindex].isEnough = false
                                } else if (res.code == -4) {
                                    this.dialogConent = {
                                        title: res.message,
                                        left: '取消',
                                        right: '确认'
                                    }
                                    this.showDialog = true
                                    this.noMoneny = true
                                    this.payStyles[this.curindex].isEnough = false
                                }
                            })
                        } else {
                            var obj = {
                                cid: this.$route.query.pid,
                                buyNum: parseInt(cookie.get('num')),
                                price: Math.ceil(this.circleprice * 100),
                                agentId: sessionStorage.myAgentId,
                                uid: this.uid
                                // status: this.$route.query.status
                            }
                            if (this.curindex == 2) {
                                market.buyUserCircle(obj).then (res => {
                                    if (res.code == 0) {
                                        this.dialogConent = {
                                            title: '购买成功！<br/>请打开“懂行”APP进行查看',
                                            left: '取消',
                                            right: '立刻前往'
                                        }
										this.nowDialog = 0;
                                        this.noMoneny = false;
                                        this.showDialog = true;   
                                        								
                                    } else if (res.code == -7) {
                                        this.dialogConent = {
                                            title: '账户余额不足！<br/>请打开APP充值',
                                            left: '取消',
                                            right: '确认'
                                        }
                                        this.showDialog = true
                                        this.noMoneny = true
                                        this.payStyles[this.curindex].isEnough = false
                                    }
                                })
                            } else if (this.curindex == 1) {
                            // market.payWechat({
                            //     uid: this.$route.query.uid || JSON.parse(localStorage.getItem('dongHang_common_user')).uid,
                            //     payType: 1,
                            //     orderType: 2,
                            //     amount: 199.00 * 100,
                            //     itemId: this.$route.query.pid
                            // }).then(res => {
                            //     if (res.code == 0) {
                            //         window.location.href = res.t
                            //     }
                            // })
                          var url = 'http://dlsapi.rz158.com/thirdPay/getConfig?url=' + location.href.split('#')[0];
                          pay.weiXinPay (url, {
                            uid: this.uid,
                            payType: 1,
                            orderType: 3,
                            thirdPay: 1,
                            type: 1,
                            agentId: sessionStorage.myAgentId,
                            amount: this.circleprice * 100,
                            itemId: this.$route.query.pid,
                            openId: localStorage.getItem("openid")
                          })

                        }
                            
                        }
                    }
                },
                cancelBtn () {
                    setTimeout (() => {
                        this.showDialog = false
                        if (this.modelCancelStatus === 'success') {
                            this.$router.push('/market')
                        }
                    }, 200)
                },
                sureBtn () {
                    if (this.isAgent && !this.noMoneny) {
                        setTimeout (() => {
                            this.showDialog = false
                            this.$router.push('/seat')
                            // this.showAddress = true
                        }, 200)
                    } else {
                        setTimeout (() => {
                            this.showDialog = false;
                            if (this.nowDialog == 0) {
                                window.location.href = 'http://donghang.rz158.com/html/html_rource_bl/html/client/app.html'
                            }
                        }, 200)
                    }
                },
                cancelAddress () {
                    this.showAddress = false
                },
                chooseRead () {
                    this.isRem = !this.isRem
                },
                changePay (index) {
                    this.curindex = index
                    for (var i=0; i<this.payStyles.length; i++) {
                        this.payStyles[i].isRem = false
                        this.payStyles[i].isEnough = true
                    }
                    this.payStyles[index].isRem = this.payStyles[index].isRem == false ? true : true
                }
            }
        }
    </script>
     <style lang="less" scoped>
        .vip-card-order {
            /* height: 2.9rem; */
            border-bottom: 0.15rem solid #efefef;
            .card-detail {
                padding: 0.3rem;
                border-bottom: 1px solid #ccc;
                font-size: 0;
                overflow: auto;
                img {
                    width: 1.5rem;
                    float: left;
                }
                .detail-intro {
                    margin: 0.3rem 0 0 1.8rem;
                    p {
                        color: #282828;
                        font-size: 0.3rem;
                        margin-bottom: 0.2rem;
                        .price {
                            float: left;
                            color: #ff2d41;
                            font-size: 0.28rem;
                        }
                        span {
                            float: right;
                            color: #282828;
                            font-size: 0.28rem;
                        }
                    }
                }
            }
            .circle-mall {
                padding: 0rem 0.3rem;
                p {
                    line-height: 0.6rem;
                    color: #282828;
                    font-size: 0.28rem;
                    span {
                        float: right;
                    }
                    &:last-child {
                        padding-bottom: 0.15rem;
                        border-bottom: 1px solid #ccc;
                    }
                }
            }
            .all-price {
                padding: 0 0.3rem;
                line-height: 1rem;
                color: #282828;
                font-size: 0.3rem;
                font-weight: bold;
                span {
                    float: right;
                }
            }
        }
        .pay-style-box {
            .title {
                color: #282828;
                font-size: 0.3rem;
                height: 0.8rem;
                line-height: 0.8rem;
                padding: 0 0.3rem;
                border-bottom: 1px solid #ccc;
            }    
        }
        .footer-pay-box {
            position: fixed;
            left: 0;
            bottom: 0;
            width: 100%;
            height: 0.8rem;
            line-height: 0.8rem;
            background: #29abae;
            color: #fff;
            font-size: 0.3rem;
            text-align: center;
        }
        .read-box {
            font-size: 0.24rem;
            margin: 0.2rem 0.1rem 0.1rem 0.3rem;
            .check-icon {
                float: left;
                width: 0.30rem;
                height: 0.30rem;
                margin-right: 0.1rem;
                background-color: #fff;
                border: 1px solid #ccc;
            }
            .checked {
                background-size: contain;
                border: 1px solid #29abae;
                background-color: #29abae;
                background-image: url(../../../assets/img/check-icon.png)
            }
            span {
                float: left;
            }
            a {
                float: left;
            }
        }
    </style>